<section id="login-block" style="width: 60%;margin-left: -30%;margin-top: -25em;">
<div class="block-border">
<div class="block-content">
<div class="block-header">登録</div>
<?php 
	if($this->err_msg != null){ ?>
	<p class="message error no-margin"><?php echo $this->err_msg; ?></p>
	<?php 		
	}
?>
	<p class="message error no-margin" id="password_err" style="display: none">同じパスワードを入力してください。</p>
	
	<form class="form" id="regist_form" method="post" action="">
			<fieldset> 
				<legend>ユーザ情報</legend>

				<p class="inline-label">
					<label for="username">ユーザ名</label>
					<?php echo $this->formText("username", $this->username);?>
				</p>
				
				<p class="inline-label">
					<label for="name">パスワード</label>
					<?php echo $this->formPassword("password");?>
				</p>
				
				<p class="inline-label">
					<label for="name">パスワード承認</label>
					<?php echo $this->formPassword("password_confirm");?>
				</p>
				
				<p class="inline-label">
					<label for="name">名前</label>
					<?php echo $this->formText("name", $this->name);?>
				</p>
				
				<p class="inline-label">
					<label for="email">メールアドレス</label>
					<?php echo $this->formText("email", $this->email);?>
				</p>
				
				<p class="inline-label">
					<label for="phone">電話番号</label>
					<?php echo $this->formText("phone", $this->phone);?>
				</p>
				
				<p class="inline-label">
					<label for="address">アドレス</label>
					<?php echo $this->formTextarea("address", $this->address, array('rows'=>3, 'cols'=>50));?>
				</p>
				
			</fieldset>

			<fieldset class="grey-bg no-margin">
				<p>
					<button type="submit">登録</button>
					<button type="button" id="cancel_btn">キャンセル</button>
				</p>
			</fieldset>
				
	</form>
</div>
</div>
</section>

<!-- Table script -->
<script type="text/javascript" src="/js/jquery.validate.js"></script>
<script type="text/javascript">
$(function(){
	$("#cancel_btn").click(function(){
		window.location = "/";
	});

	//入力を検証する
	$("#regist_form").validate({
 		rules: {
			username: {
 				required: true,
 				remote: {
 			        url: "/regist/is-username-exist",
 			        type: "post",
 			        data: {
 			          username: function() {
 			            return $("#username").val();
 			          }
 			        }
 				}
 			},
 			password: {
				required: true,
				minlength: 6
			},
			password_confirm: {
				required: true,
				minlength: 6,
				equalTo: "#password"
			},
 	 		name: {
 				required: true
 			},
 			email: {
 	 			required: true,
 	 			email: true,
 	 			remote: {
 			        url: "/regist/is-email-exist",
 			        type: "post",
 			        data: {
 			          username: function() {
 			            return $("#email").val();
 			          }
 			        }
 				}
 			},
			phone: {
				required: true,
				number: true,
				minlength: 9,
				maxlength: 11
			}
		},
		messages: {
			username: {
				required: "このフィールドは必須です。",
				remote: "このユーザ名が存在しました"
			},
			password: {
				required: "このフィールドは必須です。",
				minlength: "6文字を入力してください。"
			},
			password_confirm: {
				required: "このフィールドは必須です。",
				minlength: "6文字を入力してください。",
				equalTo: "前のパスワードのように入力してください。"
			},
			name: "このフィールドは必須です。",
			email: {
				required: "このフィールドは必須です。",
				email: "有効なメールアドレスを入力してください。",
				remote: "このメールアドレスが存在しました"
			},
			phone: {
				required: "このフィールドは必須です。",
				number: "有効な番号を入力してください。",
				minlength: "少なくとも9文字を入力してください。",
				maxlength: "以上11文字以下を入力してください。"
			}
		}
	});
});
</script>